<template>
  <div class="left-container">
    <h3>Left 组件</h3>
    <hr>

    <!-- state的访问跟之前不一样，多一个模块名 -->
    <p>购物车：{{ $store.state.cart.cartList }}</p>

    <!-- 其他的目前还一样 -->
    <!-- <p>总价是： {{ $store.getters['totalPrice'] }}</p> -->
    <!-- 开了命名空间后，这里找的getters是根里的getters -->
    <!-- <p>总价是： {{ $store.getters.totalPrice }}</p> -->

    <p>总价： {{  $store.getters['cart/totalPrice']   }}</p>

    <button @click="$store.dispatch('cart/reqCartList')" class="btn btn-primary">发请求</button>
    <button @click="$store.commit('cart/setCartList', [10,20,30])" class="btn btn-primary">直接commit</button>
   
    <!-- 默认情况下都会调用 -->
    <!-- 如果子模块都开了命名空间，只会调用根模块的 -->
    <button @click="$store.commit('fn1')" class="btn btn-primary">调用fn1</button>

    <button @click="$store.commit('user/fn1')" class="btn btn-primary">调用user-fn1</button>
    <button @click="$store.commit('cart/fn1')" class="btn btn-primary">调用cart-fn1</button>


  </div>
</template>

<script>
export default {
  name: 'Left',
}
</script>

<style>
</style>
